<template>
    <div class="edu-page-warp" id="schoolMajorDiv">
        <div class="edu-page-title">{{$t('message.filterCondition')}}</div>
        <el-card shadow="never" body-style="padding: 24px;">
            <el-form ref="queryForm" :model="queryForm" label-direction="left" label-width="100px">
                <el-row :gutter="24" style="height: 50px;">
                    <el-col :span="6">
                        <el-form-item :label="$t('label.grade')" prop="grade">
                            <el-date-picker
                                v-model="queryForm.grade"
                                value-format="yyyy"
                                type="year"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item :label="$t('label.trainingLevel')" prop="trainingLevel">
                            <DictSelect
                                v-model="queryForm.trainingLevel"
                                :data="options.trainingLevel"
                            ></DictSelect>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item
                            :label="$t('label.college')"
                            :placeholder="$t('message.all')"
                            prop="faculty"
                        >
                            <el-select
                                v-model="queryForm.faculty"
                                filterable
                                clearable
                                placeholder="请选择学院"
                            >
                                <el-option
                                    v-for="item in options.faculty"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="类别:" prop="professionCateGory">
                            <el-select v-model="queryForm.category" clearable style="width: 100%;">
                                <el-option
                                    v-for="item in options.category"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24" style="height: 50px;">
                    <el-col :span="8" :offset="16">
                        <el-form-item class="float-right">
                            <el-button @click="reset">{{$t('message.reset')}}</el-button>
                            <el-button
                                type="primary"
                                @click="getCampusProfessions"
                            >{{$t('message.filter')}}</el-button>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </el-card>
        <div class="edu-page-title mg-top">{{$t('label.major')}}</div>
        <el-card shadow="never" body-style="padding: 24px;">
            <div class="edu-opertion-bar">
                <div class="float-left">
                    <el-input
                        v-model="queryForm.keyWord"
                        :placeholder="$t('culture.profession.searchForProCodeOrname')"
                        style="width:250px"
                        @keyup.enter.native="getCampusProfessions"
                    >
                        <i
                            class="el-icon-search"
                            slot="suffix"
                            style="margin-top:10px;cursor:pointer"
                            @click="getCampusProfessions()"
                        ></i>
                    </el-input>
                </div>
                <div class="float-right" v-if="isShowHandle">
                    <el-button @click="addProfession" type="primary">{{$t('message.add')}}</el-button>
                    <el-button @click="exportCampusPro">{{$t('message.export')}}</el-button>
                    <el-button @click="copy">{{$t('culture.profession.copy')}}</el-button>
                </div>
            </div>
            <el-table
                :data="tableData"
                size="mini"
                @selection-change="handleSelectionChange"
                stripe
            >
                <el-table-column type="index" width="80" label="序号" align="center"></el-table-column>
                <!-- <el-table-column type="index" width="55" label="序号" align="center"></el-table-column> -->
                <el-table-column :label="$t('label.grade')">
                    <template slot-scope="scope">{{scope.row.grade}}</template>
                </el-table-column>
                <el-table-column :label="$t('culture.profession.proCode')">
                    <template slot-scope="scope">{{scope.row.professionCode}}</template>
                </el-table-column>
                <el-table-column :label="$t('culture.profession.proCodeName')">
                    <template slot-scope="scope">
                        <el-button
                            type="text"
                            :title="scope.row.professionName"
                            @click="viewProfession(scope.row)"
                            size="mini"
                        >{{scope.row.professionName}}</el-button>
                    </template>
                </el-table-column>
                <el-table-column :label="$t('culture.profession.proCodeNameEn')">
                    <template slot-scope="scope">
                        <el-button
                            type="text"
                            :title="scope.row.professionNameEn"
                            @click="viewProfession(scope.row)"
                            size="mini"
                        >{{scope.row.professionNameEn}}</el-button>
                    </template>
                </el-table-column>
                <el-table-column :label="$t('label.trainingLevel')">
                    <template slot-scope="scope">{{getTrainingLevelStr(scope.row.trainingLevel)}}</template>
                </el-table-column>
                <el-table-column :label="$t('label.lengthSchooling')">
                    <template slot-scope="scope">{{scope.row.lengthSchooling}}</template>
                </el-table-column>
                <el-table-column :label="$t('label.college')">
                    <template slot-scope="scope">{{getFacultyStr(scope.row.faculty)}}</template>
                </el-table-column>
                <el-table-column :label="$t('culture.profession.categoryCode')">
                    <template slot-scope="scope">
                        <span :title="scope.row.subjectCategory">{{scope.row.subjectCategory}}</span>
                    </template>
                </el-table-column>
                <el-table-column :label="$t('message.operating')" width="150">
                    <template slot-scope="scope">
                        <el-button
                            type="text"
                            @click="editProfession(scope.row)"
                            size="mini"
                        >{{$t('message.edit')}}</el-button>
                        <el-button
                            type="text"
                            @click="delCampusPro(scope.row.id)"
                            size="mini"
                        >{{$t('message.delete')}}</el-button>
                        <el-button
                            type="text"
                            :disabled="scope.row.category=='1'"
                            @click="directionDetail(scope.row)"
                            size="mini"
                        >{{$t('culture.profession.direction')}}</el-button>
                        <!--   <el-button type="text"  v-if="functions['edit_workflow']" size="mini">{{$t('message.edit')}}</el-button>
                        <el-button type="text" @click="deleteTemplate(scope.row)" v-if="functions['delete_workflow']" size="mini">{{$t('message.delete')}}</el-button>-->
                    </template>
                </el-table-column>
            </el-table>
            <div class="edu-pagination">
                <div class="float-right">
                    <el-pagination
                        @size-change="onPageSizeChange"
                        @current-change="onCurrentPageChange"
                        :current-page="queryForm.pageNum_"
                        :page-sizes="[10,20, 40, 80, 100,500,1000]"
                        :page-size="queryForm.pageSize_"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="queryForm.total_"
                        style="float: right;margin:10px 60px 0 0;"
                    ></el-pagination>
                </div>
            </div>
        </el-card>

        <!-- 编辑/新增专业对话框 -->
        <el-dialog
            :title="dialogTitle"
            width="60%"
            class="gCourseAddDialog"
            :visible.sync="showDialog"
            @close="resetFormValidate()"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
        >
            <el-form
                :model="model"
                ref="model"
                :rules="rules"
                label-direction="left"
                label-width="120px"
            >
                <el-row :gutter="24">
                    <el-col :span="8">
                        <el-form-item :label="$t('dic.grade') + ':'" prop="grade">
                            <el-date-picker
                                :disabled="isEdit"
                                v-model="model.grade"
                                :placeholder="$t('message.plsSelect')"
                                type="year"
                                value-format="yyyy"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('dic.faculty') + ':'" prop="faculty">
                            <el-select
                                :disabled="isEdit"
                                v-model="model.faculty"
                                :placeholder="$t('message.plsSelect')"
                                filterable
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.faculty"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('dic.trainingLevel') + ':'" prop="trainingLevel">
                            <el-select
                                :disabled="isEdit"
                                v-model="model.trainingLevel"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                                @change="findToDegreeListByTrainingLevelId"
                            >
                                <el-option
                                    v-for="item in options.trainingLevel"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.proCode')"
                            prop="professionCode"
                        >
                            <el-input
                                :disabled="isEdit"
                                v-model="model.professionCode"
                                :placeholder="$t('culture.rules.plsInputProCode')"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.proCodeName')"
                            prop="professionName"
                        >
                            <el-input
                                :disabled="isEdit"
                                v-model="model.professionName"
                                :placeholder="$t('culture.rules.plsInputProName')"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.proCodeNameEn')"
                            prop="professionNameEn"
                        >
                            <el-input
                                :disabled="isEdit"
                                v-model="model.professionNameEn"
                                :placeholder="$t('culture.rules.plsInputProNameEN')"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.category')" prop="category">
                            <el-select
                                v-model="model.category"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.category"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.categoryCode')"
                            prop="categoryCode"
                        >
                            <el-select
                                :disabled="isYuKe"
                                v-model="model.categoryCode"
                                multiple
                                collapse-tags
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.categoryCode"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.professionClassCode')"
                            prop="professionClassCode" ref="professionClassCodeModel"
                        >
                            <el-select
                                multiple
                                collapse-tags
                                :disabled="isbelongBigProfession || isYuKe"
                                v-model="model.professionClassCode"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.professionClass"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.ministryEduCode')"
                            prop="ministryEduCode" ref="ministryEduCodeModel"
                        >
                            <el-select
                                multiple
                                collapse-tags
                                :disabled="isYuKe||isbelongBigProfession"
                                v-model="model.ministryEduCode"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.ministryEduCode"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('label.lengthSchooling')" prop="lengthSchooling">
                            <el-select
                                v-model="model.lengthSchooling"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.lengthSchooling"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('label.toDegree')">
                            <el-select
                                multiple
                                collapse-tags
                                v-model="model.toDegree"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.toDegree"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.belongBigProfession')"
                          ref="belongBigProfessionModel">
                            <el-select
                                v-model="model.belongBigProfession"
                                :placeholder="$t('message.plsSelect')"
                                :disabled="isbelongBigProfession"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.belongBigProfession"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <!-- <el-form-item :label="$t('culture.profession.startTime')" prop="startTime">
							<el-date-picker
								v-model="model.startTime"
								type="date"
								format="yyyy-MM-dd"
								value-format="timestamp"
								:placeholder="$t('message.plsSelect')"
								style="width: 100%;"
							></el-date-picker>
                        </el-form-item>-->
                        <el-form-item label="开始学期" prop="startTime">
                            <el-select v-model="model.startTime" @change="handleSemesterChange1(1)">
                                <el-option
                                    v-for="item in options.beginSemester"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="结束学期" prop="endTime">
                            <el-select v-model="model.endTime" @change="handleSemesterChange1(2)">
                                <el-option
                                    v-for="item in options.endSemester"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24" style="height: 50px">
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.enrollTwice')">
                            <el-radio v-model="model.enrollTwice" label="1">是</el-radio>
                            <el-radio v-model="model.enrollTwice" label="2">否</el-radio>
                        </el-form-item>
                    </el-col>
                    <el-col :span="16">
                        <el-form-item
                            :label="$t('culture.profession.proDirection')"
                            v-if="isEdit&&this.model.category=='2'"
                        >
                            <el-input v-model="direcModel.direction" :disabled="true"/>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24" style="height: 50px;">
                    <el-col :span="24">
                        <el-form-item :label="$t('message.remark')">
                            <el-input
                                v-model="model.remark"
                                type="textarea"
                                :rows="3"
                                style="width:100%"
                                maxlength="255"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <span slot="footer">
                <el-button
                    @click="showDialog = false;model.categoryCode=[];moel.ministryEduCode=[]"
                >{{$t('message.cancel')}}</el-button>
                <el-button type="primary" @click="confirm">{{ $t('message.confirm') }}</el-button>
            </span>
        </el-dialog>

        <!-- 查看专业对话框 -->
        <el-dialog
            :title="viewDialogTitle"
            width="60%"
            class="gCourseAddDialog"
            :visible.sync="showViewDialog"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
        >
            <el-form
                :model="viewModel"
                ref="viewModel"
                :rules="rules"
                label-direction="left"
                label-width="130px"
            >
                <el-row :gutter="24">
                    <el-col :span="8">
                        <el-form-item :label="$t('dic.grade') + ':'" prop="grade">
                            <el-date-picker
                                :disabled="isView"
                                v-model="viewModel.grade"
                                :placeholder="$t('message.plsSelect')"
                                type="year"
                                value-format="yyyy"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('dic.faculty') + ':'" prop="faculty">
                            <el-select
                                :disabled="isView"
                                v-model="viewModel.faculty"
                                :placeholder="$t('message.plsSelect')"
                                filterable
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.faculty"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('dic.trainingLevel') + ':'" prop=" trainingLevel">
                            <el-select
                                :disabled="isView"
                                v-model="viewModel.trainingLevel"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.trainingLevel"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.proCode')"
                            prop="professionCode"
                        >
                            <el-input
                                :disabled="isView"
                                v-model="viewModel.professionCode"
                                :placeholder="$t('culture.rules.plsInputProCode')"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.proCodeName')"
                            prop="professionName"
                        >
                            <el-input
                                :disabled="isView"
                                v-model="viewModel.professionName"
                                :placeholder="$t('culture.rules.plsInputProName')"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.proCodeNameEn')"
                            prop="professionNameEn"
                        >
                            <el-input
                                :disabled="isView"
                                v-model="viewModel.professionNameEn"
                                :placeholder="$t('culture.rules.plsInputProNameEN')"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.category')" prop="category">
                            <el-select
                                v-model="viewModel.category"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                                :disabled="isView"
                            >
                                <el-option
                                    v-for="item in options.category"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.categoryCode')"
                            prop="categoryCode"
                        >
                            <el-select
                                v-model="viewModel.categoryCode"
                                multiple
                                :disabled="isView"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.categoryCode"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.professionClassCode')"
                            prop="professionClassCode"
                        >
                            <el-select
                                multiple
                                :disabled="isView||isbelongBigProfession || isYuKe"
                                v-model="viewModel.professionClassCode"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.professionClass"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="8">
                        <el-form-item
                            :label="$t('culture.profession.ministryEduCode')"
                            prop="ministryEduCode"
                        >
                            <el-select
                                multiple
                                :disabled="isView||isYuKe||isbelongBigProfession"
                                v-model="viewModel.ministryEduCode"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.ministryEduCode"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('label.lengthSchooling')" prop="lengthSchooling">
                            <el-select
                                v-model="viewModel.lengthSchooling"
                                :placeholder="$t('message.plsSelect')"
                                :disabled="isView"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.lengthSchooling"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('label.toDegree')">
                            <el-select
                                v-model="viewModel.toDegree"
                                multiple
                                :placeholder="$t('message.plsSelect')"
                                :disabled="isView"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.toDegree"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.belongBigProfession')">
                            <el-select
                                v-model="viewModel.belongBigProfession"
                                :placeholder="$t('message.plsSelect')"
                                :disabled="isbelongBigProfession||isView"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="item in options.belongBigProfession"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="开始学期" prop="startTime">
                            <el-select
                                v-model="viewModel.startTime"
                                :disabled="isView"
                                @change="handleSemesterChange1(1)"
                            >
                                <el-option
                                    v-for="item in options.beginSemester"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="结束学期" prop="endTime">
                            <el-select
                                v-model="viewModel.endTime"
                                :disabled="isView"
                                @change="handleSemesterChange1(2)"
                            >
                                <el-option
                                    v-for="item in options.endSemester"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24" style="height: 50px">
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.enrollTwice')">
                            <el-radio v-model="viewModel.enrollTwice" label="1" :disabled="isView">是</el-radio>
                            <el-radio v-model="viewModel.enrollTwice" label="2" :disabled="isView">否</el-radio>
                        </el-form-item>
                    </el-col>
                    <el-col :span="16">
                        <el-form-item
                            :label="$t('culture.profession.proDirection')"
                            v-if="isView&&this.viewModel.category=='2'"
                        >
                            <el-input v-model="direcModel.direction" :disabled="true"/>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24" style="height: 50px;">
                    <el-col :span="24">
                        <el-form-item :label="$t('message.remark')">
                            <el-input
                                v-model="viewModel.remark"
                                type="textarea"
                                :rows="3"
                                style="width:100%"
                                maxlength="255"
                                disabled="true"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <span slot="footer">
                <el-button
                    @click="showViewDialog = false;viewModel.categoryCode=[];viewModel.ministryEduCode=[]"
                >{{$t('message.close')}}</el-button>
            </span>
        </el-dialog>
        <!-- 方向对话框 -->
        <el-dialog
            :title="direcTitle"
            width="70%"
            class="gCourseAddDialog"
            :visible.sync="showdirectionDialog"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
        >
            <el-card shadow="never" body-style="padding: 24px;">
                <div class="edu-opertion-bar">
                    <div class="float-left">
                        <el-input
                            v-model="queryForm_d.keyWord"
                            :placeholder="$t('culture.profession.searchForProCodeOrname')"
                            style="width:250px"
                            @keyup.enter.native="getDirMaintens"
                        >
                            <i
                                class="el-icon-search"
                                slot="suffix"
                                style="margin-top:10px;cursor:pointer"
                                @click="getDirMaintens()"
                            ></i>
                        </el-input>
                    </div>
                    <div class="float-right">
                        <el-button @click="exportDirrection">{{$t('message.export')}}</el-button>
                        <el-button @click="addDirection" type="primary">{{$t('message.add')}}</el-button>
                    </div>
                </div>
                <el-table
                    :data="table"
                    size="mini"
                    @selection-change="handleSelectionChange"
                    stripe
                >
                    <!--  <el-table-column type="selection" width="30"></el-table-column> -->
                    <el-table-column type="index" width="80" label="序号" align="center"></el-table-column>
                    <el-table-column :label="$t('culture.profession.directionCode')">
                        <template slot-scope="scope">{{scope.row.code}}</template>
                    </el-table-column>
                    <el-table-column :label="$t('culture.profession.directionName')">
                        <template slot-scope="scope">
                            <span :title="scope.row.name">{{scope.row.name}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column :label="$t('culture.profession.directionNameEn')">
                        <template slot-scope="scope">
                            <span :title="scope.row.nameEn">{{scope.row.nameEn}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column :label="$t('label.trainingLevel')">
                        <template slot-scope="scope">{{scope.row.trainingLevelI18n}}</template>
                    </el-table-column>
                    <el-table-column :label="$t('label.college')">
                        <template slot-scope="scope">{{scope.row.facultyI18n}}</template>
                    </el-table-column>
                    <el-table-column :label="$t('culture.profession.proCodeName')">
                        <template slot-scope="scope">
                            <span :title="scope.row.professionName">{{scope.row.professionName}}</span>
                        </template>
                    </el-table-column>

                    <el-table-column :label="$t('message.operating')">
                        <template slot-scope="scope">
                            <el-button
                                type="text"
                                @click="editDirection(scope.row)"
                                size="mini"
                            >{{$t('message.edit')}}</el-button>
                            <!--   <el-button type="text"  v-if="functions['edit_workflow']" size="mini">{{$t('message.edit')}}</el-button>
                            <el-button type="text" @click="deleteTemplate(scope.row)" v-if="functions['delete_workflow']" size="mini">{{$t('message.delete')}}</el-button>-->
                        </template>
                    </el-table-column>
                </el-table>
                <div class="edu-pagination">
                    <div class="float-right">
                        <el-pagination
                            @size-change="onPageSizeChange_d"
                            @current-change="onCurrentPageChange_d"
                            :current-page="queryForm_d.pageNum_"
                            :page-sizes="[10, 20, 40, 100]"
                            :page-size="queryForm_d.pageSize_"
                            layout="total, sizes, prev, pager, next, jumper"
                            :total="queryForm_d.total_"
                            style="float: right;margin:10px 60px 0 0;"
                        ></el-pagination>
                    </div>
                </div>
            </el-card>
        </el-dialog>

        <!-- 编辑/新增方向对话框 -->
        <el-dialog
            :title="addDirecTitle"
            width="60%"
            height="330px"
            :visible.sync="editPositinDialog"
            @close="resetFormValidate_d()"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
        >
            <el-form
                :model="directionModel"
                ref="directionModel"
                :rules="rules_direct"
                label-direction="left"
                label-width="100px"
            >
                <el-row :gutter="20" style="height: 50px;">
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.directionCode')" prop="code">
                            <el-input
                                :disabled="isEdit"
                                v-model="directionModel.code"
                                :placeholder="$t('culture.rules.plsInputDirCode')"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.directionName')" prop="name">
                            <el-input
                                :disabled="isEdit"
                                v-model="directionModel.name"
                                :placeholder="$t('culture.rules.plsInputDirName')"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.directionNameEn')">
                            <el-input
                                :disabled="isEdit"
                                v-model="directionModel.nameEn"
                                :placeholder="$t('culture.rules.plsInputDirNameEN')"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24" style="height: 50px;">
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.proClassCode')">
                            <el-input
                                :disabled="true"
                                v-model="directionModel.professionCode"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.proCodeName')">
                            <el-input
                                :disabled="true"
                                v-model="directionModel.professionName"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.proCodeNameEn')">
                            <el-input
                                :disabled="true"
                                v-model="directionModel.professionNameEn"
                                style="width: 100%;"
                            />
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.startDate')" prop="startTime">
                            <el-date-picker
                                v-model="directionModel.startTime"
                                type="date"
                                format="yyyy-MM-dd"
                                value-format="timestamp"
                                :placeholder="$t('message.plsSelect')"
                                style="width: 100%;"
                            ></el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('culture.profession.failureTime')">
                            <el-date-picker
                                v-model="directionModel.failureTime"
                                type="date"
                                format="yyyy-MM-dd"
                                style="width: 100%;"
                                value-format="timestamp"
                            ></el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24" style="height: 50px;">
                    <el-col :span="24">
                        <el-form-item :label="$t('message.remark')">
                            <el-input
                                v-model="directionModel.remark"
                                type="textarea"
                                :rows="3"
                                style="width:100%"
                                maxlength="255"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <span slot="footer">
                <el-button @click="editPositinDialog = false">{{$t('message.cancel')}}</el-button>
                <el-button type="primary" @click="confirmdirection">{{ $t('message.confirm') }}</el-button>
            </span>
        </el-dialog>

        <!-- 复制对话框 -->
        <el-dialog
            :title="copyDialogTitle"
            width="30%"
            :visible.sync="copyModel.showCopyDialog"
            @close="resetCopyValidate()"
            :close-on-click-modal="false"
            id="profession-copy-dialog"
            :close-on-press-escape="false"
        >
            <el-form
                :model="copyModel"
                ref="copyModel"
                :rules="rules"
                label-position="left"
                label-width="100px"
            >
                <el-row :gutter="24">
                    <el-col>
                        <el-form-item :label="$t('culture.profession.copyGrade')" prop="copyGrade">
                            <el-date-picker
                                v-model="copyModel.copyGrade"
                                :placeholder="$t('message.plsSelect')"
                                type="year"
                                value-format="yyyy"
                                style="width: 80%;"
                            />
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <span slot="footer">
                <el-button @click="copyModel.showCopyDialog = false">{{$t('message.cancel')}}</el-button>
                <el-button type="primary" @click="copyConfirm">{{ $t('message.confirm') }}</el-button>
            </span>
        </el-dialog>
    </div>
</template>
<script>
import bus from "common/src/utils/bus";
import UTILS from "common/src/utils/utils";
import { queryDic, findTrainingLevelByProjId } from "common/src/api/dictionary";
import {
    findCategoryList,
    findProfessionClassList,
    findProfessionList,
    findDegreeTypeByTrainingLevel
} from "common/src/api/culture/eduProfession";
import {
    findCampusProfessionList,
    addCampusPro,
    updateCampusPro,
    findCampusProById,
    delCampusProById,
    copyCampusPro,
    findProByParam,
    findBigProByParam,
    exportCampusPro,
    addDirMainten,
    editDirMainten,
    findDirMaintenList,
    findDirMaintenDetail,
    findDirMaintenByPro,
    exportDirMainten
} from "common/src/api/culture/campusProfession";
export default {
    name: "schoolProfession",
    data() {
        var validateCode = (rule, value, callback) => {
            var regex = /^\d{5}$/;
            if (regex.test(value)) {
                callback();
            } else {
                callback(new Error(this.$t("culture.rules.plsInputFiveNum")));
            }
        };
        var validateName = (rule, value, callback) => {
            var regex = /^[\u4E00-\u9FA50-9\(\)\s\S]{2,30}$/;
            if (regex.test(value)) {
                callback();
            } else {
                callback(new Error("中文或者数字2~30位"));
            }
        };
        var validateNameEn = (rule, value, callback) => {
            var regex = /^[A-Za-z0-9\(\)\s\S]{2,30}$/;
            if (regex.test(value)) {
                callback();
            } else {
                callback(new Error("英文或者数字2~30位"));
            }
        };
        return {
            dialogTitle: "",
            copyDialogTitle: this.$t("culture.profession.copyDialogTitle"),
            isRequired: true,
            direcTitle: "",
            addDirecTitle: "",
            isEdit: false,
            isView: false,
            isCopy: false,
            isClearCateCode: true,
            isClearProCode: true,
            isYuKe: false,
            isbelongBigProfession: false,
            tableData: [],
            table: [],
            showDialog: false,
            showdirectionDialog: false,
            editPositinDialog: false,
            showViewDialog: false,
            isShowHandle: false, //是否显示操作按钮
            queryForm: {
                pageNum_: 1,
                pageSize_: 10,
                total_: 0,
                copyGrade: "",
                grade: "",
                trainingLevel: "",
                faculty: "",
                keyWord: "",
                category: ""
            },
            queryForm_d: {
                pageNum_: 1,
                pageSize_: 10,
                total_: 0,
                grade: "",
                professionCode: "",
                keyWord: ""
            },
            copyModel: {
                showCopyDialog: false,
                copyGrade: ""
            },
            viewModel: {
                grade: "",
                faculty: "",
                trainingLevel: "",
                professionCode: "",
                professionName: "",
                professionNameEn: "",
                category: "",
                categoryCode: [],
                professionClassCode: [],
                ministryEduCode: [],
                campusEduProRelations: [],
                ministryEduCode: "",
                lengthSchooling: "",
                toDegree: "",
                belongBigProfession: "",
                startTime: "",
                endTime: "",
                remark: "",
                enrollTwice: "2"
            },
            model: {
                grade: "",
                faculty: "",
                trainingLevel: "",
                professionCode: "",
                professionName: "",
                professionNameEn: "",
                category: "",
                categoryCode: [],
                professionClassCode: [],
                ministryEduCode: [],
                campusEduProRelations: [],
                ministryEduCode: "",
                lengthSchooling: "",
                toDegree: [],
                belongBigProfession: "",
                startTime: "",
                endTime: "",
                remark: "",
                enrollTwice: "2"
            },
            direcModel: {
                direction: ""
            },
            directionModel: {
                grade: "",
                code: "",
                name: "",
                nameEn: "",
                startTime: "",
                failureTime: "",
                remark: "",
                professionCode: "",
                professionName: "",
                professionNameEn: "",
                faculty: "",
                trainingLevel: "",
                facultyI18n: "",
                trainingLevelI18n: ""
            },
            options: {
                grade: [],
                trainingLevel: [],
                faculty: [],
                category: [],
                categoryCode: [],
                professionClass: [],
                ministryEduCode: [],
                lengthSchooling: [],
                toDegree: [],
                allToDegree: [],
                belongBigProfession: [],
                beginSemester: [],
                endSemester: [],
                category: []
            },
            rules: {
                grade: [
                    {
                        required: true,
                        message: this.$t("culture.rules.plsChooseGrade"),
                        trigger: "blur"
                    }
                ],
                copyGrade: [
                    {
                        required: true,
                        message: this.$t("culture.rules.plsChooseGrade"),
                        trigger: "blur"
                    }
                ],
                faculty: [
                    {
                        required: true,
                        message: this.$t("culture.rules.plsChooseFaculy"),
                        trigger: "change"
                    }
                ],
                trainingLevel: [
                    {
                        required: true,
                        message: this.$t(
                            "culture.rules.plsChooseTrainingLevel"
                        ),
                        trigger: "change"
                    }
                ],
                professionCode: [
                    {
                        required: true,
                        message: this.$t("culture.rules.proCodeReq"),
                        trigger: "blur"
                    },
                    {
                        validator: validateCode,
                        trigger: "blur"
                    }
                ],
                professionName: [
                    {
                        required: true,
                        message: this.$t("culture.rules.proNameReq"),
                        trigger: "blur"
                    },
                    {
                        validator: validateName,
                        trigger: "blur"
                    }
                ],
                professionNameEn: [
                    {
                        validator: validateNameEn,
                        trigger: "blur"
                    }
                ],
                category: [
                    {
                        required: true,
                        message: this.$t("culture.rules.plsChooseCategory"),
                        trigger: "change"
                    }
                ],
                categoryCode: [
                    {
                        validator: this.isCateReq,
                        trigger: "change"
                    }
                ],
                lengthSchooling: [
                    {
                        required: true,
                        message: this.$t(
                            "culture.rules.plsChooseLengthSchooling"
                        ),
                        trigger: "change"
                    }
                ],
                startTime: [
                    {
                        required: true,
                        message: this.$t(
                            "culture.rules.plsChooseBeginSemester"
                        ),
                        trigger: "change"
                    }
                ],
                endTime: [
                    {
                        required: true,
                        message: this.$t("culture.rules.plsChooseEndSemester"),
                        trigger: "change"
                    }
                ],
                ministryEduCode: [
                    {
                        validator: this.isProReq,
                        trigger: "change"
                    }
                ],
                professionClassCode: [
                    {
                        validator: this.isProReq,
                        trigger: "change"
                    }
                ]
            },
            rules_direct: {
                code: [
                    {
                        required: true,
                        message: this.$t("culture.rules.directionCodeReq"),
                        trigger: "blur"
                    }
                ],
                name: [
                    {
                        required: true,
                        message: this.$t("culture.rules.directionNameReq"),
                        trigger: "blur"
                    }
                ],
                startTime: [
                    {
                        required: true,
                        message: this.$t("culture.rules.plsChooseStartTime"),
                        trigger: "blur"
                    }
                ]
            }
        };
    },
    created() {
        this.$store.getters.getFuncUnderPage(this.$route.path).then(funcs => {
            this.functions = funcs;
        });
    },
    mounted() {
        //进入页面根据本科生和研究生判断操作按钮是否显示
        let user =
            this.$store.state.session.user ||
            JSON.parse(localStorage.getItem("user"));
        if (user) {
            this.isShowHandle = user.currentManageDptId === "1";
        }
        bus.$on("updateCurrentManageDeptId", id => {
            if (id == 1) {
                this.isShowHandle = true;
            } else {
                this.isShowHandle = false;
            }
            this.queryForm.projId = id;
            this.initTrainingLevelOptions();
            this.getCampusProfessions();
            this.getCategoryList();
            this.initSemester();
        });
        this.initOptions();
        this.initProjId();
        this.initTrainingLevelOptions();
        this.getCampusProfessions();
        this.getCategoryList();
        this.initSemester();
        //this.getProfessionClassList();
        //this.getEduProCode();
    },
    activated() {
        // this.getCampusProfessions();
    },
    computed: {
        watchTraLevel() {
            const obj = {
                trainingLevel: this.model.trainingLevel,
                grade: this.model.grade,
                faculty: this.model.faculty
            };
            return obj;
        },
        //监听类别
        watchcategory() {
            const obj = {
                category: this.model.category
            };
            return obj;
        },
        //监听学科门类
        watchCategoryCode() {
            const obj = {
                categoryCode: this.model.categoryCode
            };
            return obj;
        },
        //监听专业类
        watchProClassCode() {
            const obj = {
                categoryCode: this.model.professionClassCode
            };
            return obj;
        }
    },
    watch: {
        watchTraLevel: {
            handler: function(newVal, oldVal) {
                if (this.model.category != 1) {
                    this.options.belongBigProfession = [];
                    if (this.model.grade && this.model.category) {
                        let param = {};
                        param.grade = +this.model.grade;
                        param.trainingLevel = this.model.trainingLevel;
                        param.faculty = this.model.faculty;
                        param.category = "1";
                        this.getBelongBigPro(param);
                    }
                }
                if (this.model.trainingLevel == 5) {
                    this.isYuKe = true;
                    this.model.categoryCode = [];
                    this.model.ministryEduCode = [];
                } else {
                    this.isYuKe = false;
                }
            },
            deep: true
        },
        watchcategory: {
            handler: function(newVal, oldVal) {
                if (this.model.category == 1) {
                    this.isbelongBigProfession = true;
                    this.model.professionClassCode = [];
                    this.options.belongBigProfession = [];
                    this.model.belongBigProfession = "";
                    this.options.ministryEduCode = this.options.categoryCode;
                    this.model.ministryEduCode = this.model.categoryCode;
                    this.options.ministryEduCode = [];
                    this.model.ministryEduCode = [];
                    
                    // 清除部分校验提示
                    this.$refs['ministryEduCodeModel'].clearValidate();
                    this.$refs['belongBigProfessionModel'].clearValidate();
                    this.$refs['professionClassCodeModel'].clearValidate();
                } else {
                    this.options.belongBigProfession = [];
                    if (this.model.grade && this.model.category) {
                        let param = {};
                        param.grade = +this.model.grade;
                        param.trainingLevel = this.model.trainingLevel;
                        param.faculty = this.model.faculty;
                        param.category = "1";
                        this.getBelongBigPro(param);
                    }
                    this.isbelongBigProfession = false;
                }
            },
            deep: true
        },
        //监听学科门类
        watchCategoryCode: {
            handler: function(newVal, oldVal) {
                if (this.model.trainingLevel != 5) {
                    if (this.model.category == 1) {
                        this.options.ministryEduCode = [];
                        this.model.ministryEduCode = [];
                    } else {
                        if (!this.isClearCateCode) {
                            this.getProfessionClassList();
                            this.isClearCateCode = true;
                        } else {
                            this.model.professionClassCode = [];
                            this.model.ministryEduCode = [];
                            this.getProfessionClassList();
                            this.getEduProCode();
                        }
                    }
                }
            },
            deep: true
        },
        watchProClassCode: {
            handler: function(newVal, oldVal) {
                if (this.model.trainingLevel != 5) {
                    if (!this.isClearProCode) {
                        this.getEduProCode();
                        this.isClearProCode = true;
                    } else {
                        this.model.ministryEduCode = [];
                        this.getEduProCode();
                    }
                }
                deep: true;
            }
        }
    },
    methods: {
        initProjId() {
            let currentUser =
                (this.$store.state.session && this.$store.state.session.user) ||
                JSON.parse(localStorage.getItem("user"));
            this.queryForm.projId = currentUser.currentManageDptId;
        },
        initTrainingLevelOptions() {
            findTrainingLevelByProjId(this.queryForm.projId).then(res => {
                if (res.code === 200) {
                    this.queryForm.trainingLevel = "";
                    this.options.trainingLevel = res.data;
                    this.loadTrainingLevelOptions("trainingLevel", res.data);
                }
            });
        },
        initSemester() {
            if (this.options.beginSemester.length > 0) return;
            let years = [];
            for (let i = 1; i < 11; i++) {
                years.push({
                    label: this.getSemester(i),
                    value: Number(i)
                });
            }
            this.options.beginSemester = years;
            this.options.endSemester = years;
        },
        getSemester(n) {
            if (n) return `第${this.$utils.numberToChinese(n)}学期`;
            else return "";
        },
        handleSemesterChange1(type) {
            if (
                this.model.endTime &&
                this.model.startTime &&
                this.model.startTime >= this.model.endTime
            ) {
                this.$message({
                    type: "warning",
                    message: "请正确选择学期"
                });
                if (type == 1) this.model.startTime = "";
                else this.model.endTime = "";
            }
        },
        isProReq(rule, code, callback) {
            if (!this.isYuKe) {
                if (!this.isbelongBigProfession) {
                    if (code.length == 0) {
                        callback(new Error(this.$t("culture.rules.plsChoose")));
                    } else {
                        callback();
                    }
                } else {
                    callback();
                }
            } else {
                callback();
            }
        },
        isCateReq(rule, code, callback) {
            if (!this.isYuKe) {
                if (code.length == 0) {
                    callback(new Error(this.$t("culture.rules.plsChoose")));
                } else {
                    callback();
                }
            } else {
                callback();
            }
        },
        getCampusProfessions() {
            let postData = _.cloneDeep(this.queryForm);
            postData.grade = Number(postData.grade);
            findCampusProfessionList(postData).then(res => {
                if (res.code == 200) {
                    //根据部门判断是否显示数据
                    if (this.isShowHandle) {
                        this.tableData = res.data.list;
                        // this.model.pageNum_ = res.data.pageNum_;
                        // this.model.pageSize_ = res.data.pageSize_;
                        // this.model.total_ = res.data.total_;
                        this.queryForm.pageNum_ = res.data.pageNum_;
                        this.queryForm.pageSize_ = res.data.pageSize_;
                        this.queryForm.total_ = res.data.total_;
                    } else {
                        this.tableData = [];
                        // this.model.pageNum_ = 1;
                        // this.model.pageSize_ = 10;
                        // this.model.total_ = 0;
                        this.queryForm.pageNum_ = 1;
                        this.queryForm.pageSize_ = 10;
                        this.queryForm.total_ = 0;
                    }
                }
            });
        },
        onPageSizeChange(size) {
            this.queryForm.pageSize_ = size;
            this.getCampusProfessions();
        },
        onCurrentPageChange(currentPage) {
            this.queryForm.pageNum_ = currentPage;
            this.getCampusProfessions();
        },
        onPageSizeChange_d(size) {
            this.queryForm_d.pageSize_ = size;
            this.getDirMaintens();
        },
        onCurrentPageChange_d(currentPage) {
            this.queryForm_d.pageNum_ = currentPage;
            this.getDirMaintens();
        },
        getDirMaintens() {
            findDirMaintenList(this.queryForm_d).then(res => {
                if (res.code == 200) {
                    this.table = res.data.list;
                    this.queryForm_d.pageNum_ = res.data.pageNum_;
                    this.queryForm_d.pageSize_ = res.data.pageSize_;
                    this.queryForm_d.total_ = res.data.total_;
                }
            });
        },
        directionDetail(data) {
            this.queryForm_d.grade = data.grade;
            this.queryForm_d.professionCode = data.professionCode;
            this.direcTitle = data.professionName;
            this.directionModel.grade = data.grade;
            this.directionModel.professionCode = data.professionCode;
            this.directionModel.professionName = data.professionName;
            this.directionModel.professionNameEn = data.professionNameEn;
            this.showdirectionDialog = true;
            this.getDirMaintens();
        },
        getCategoryList() {
            findCategoryList().then(res => {
                if (res.code == 200) {
                    for (let key in res.data) {
                        this.options.categoryCode.push({
                            value: res.data[key].code,
                            label:
                                res.data[key].name +
                                "(" +
                                res.data[key].code +
                                ")"
                        });
                    }
                }
            });
        },
        getProfessionClassList() {
            let _this = this;
            let categoryCodeArr;
            if (_this.model.categoryCode.length > 0) {
                categoryCodeArr = _this.model.categoryCode;
            } else {
                categoryCodeArr = _this.viewModel.categoryCode;
            }
            let data = "?category=";
            _this.options.professionClass = [];
            categoryCodeArr.forEach(element => {
                findProfessionClassList(data + element).then(res => {
                    if (res.code == 200) {
                        for (let key in res.data) {
                            _this.options.professionClass.push({
                                value: res.data[key].code,
                                label:
                                    res.data[key].name +
                                    "(" +
                                    res.data[key].code +
                                    ")"
                            });
                        }
                    }
                });
            });
        },
        getEduProCode() {
            let _this = this;
            let professionClassCodeArr = [];
            let categoryCodeArr = [];
            let data = "?category=";
            let professionClassCodeArr1 = [];
            let categoryCodeArr1 = [];
            if (_this.model.ministryEduCode.length > 0) {
                categoryCodeArr = _this.model.categoryCode;
                professionClassCodeArr = _this.model.professionClassCode;
            } else {
                professionClassCodeArr = _this.viewModel.professionClassCode;
                professionClassCodeArr1 = _this.model.professionClassCode;
                categoryCodeArr = _this.viewModel.categoryCode;
                categoryCodeArr1 = _this.model.categoryCode;
            }
            _this.options.ministryEduCode = [];
            [...professionClassCodeArr, ...professionClassCodeArr1].forEach(
                proClass => {
                    [...categoryCodeArr, ...categoryCodeArr1].forEach(
                        cateCode => {
                            if (proClass.substring(0, 2) == cateCode) {
                                findProfessionList(
                                    data + cateCode + "&proClass=" + proClass
                                ).then(res => {
                                    if (res.code == 200) {
                                        for (let key in res.data) {
                                            this.options.ministryEduCode.push({
                                                value: res.data[key].code,
                                                label:
                                                    res.data[key].name +
                                                    "(" +
                                                    res.data[key].code +
                                                    ")"
                                            });
                                        }
                                    }
                                });
                            }
                        }
                    );
                }
            );
        },
        getBelongBigPro(param) {
            findProByParam(param).then(res => {
                if (res.code == 200) {
                    let temp = [];
                    res.data.length > 0 &&
                        res.data.forEach(e => {
                            temp.push({
                                value: e.professionCateGory,
                                label: `${e.professionCateGoryName}(${
                                    e.professionCateGory
                                })`
                            });
                        });
                    this.options.belongBigProfession =
                        temp.length > 0 ? Array.from(new Set(temp)) : [];
                }
            });
        },
        getBelongBigPro(param) {
			findProByParam(param).then(res => {
				if (res.code == 200) {
					let temp = [];
					res.data.length > 0 &&
						res.data.forEach(e => {
							temp.push({
								value: e.professionCateGory,
								label: `${e.professionCateGoryName}(${
									e.professionCateGory
								})`
							});
						});
					this.options.belongBigProfession =
						temp.length > 0 ? Array.from(new Set(temp)) : [];
				}
			});
        },
        initOptions() {
            const data = {
                lang: this.$store.getters.language || "cn",
                type: "allChild",
                keys: ["X_PYCC", "X_YX", "X_XWLX", "X_XZ"]
            };
            this.options.category.push({
                label: this.$t("culture.profession.profession"),
                value: "2"
            });
            this.options.category.push({
                label: this.$t("culture.profession.bigProfession"),
                value: "1"
            });
            // 查询管理部门为1的培养层次
            findTrainingLevelByProjId(1).then(res => {
                if (res.code === 200) {
                    this.loadTrainingLevelOptions("trainingLevel", res.data);
                }
            });
            queryDic(data)
                .then(res => {
                    if (res.code == 200) {
                        UTILS.fillSelect(
                            {
                                // trainingLevel: "X_PYCC",
                                faculty: "X_YX",
                                allToDegree: "X_XWLX",
                                lengthSchooling: "X_XZ"
                            },
                            res.data,
                            this.options
                        );
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        loadTrainingLevelOptions(optionKey, dataObj) {
            this.options[optionKey] = [];
            _.each(dataObj, level => {
                this.options[optionKey].push({
                    label:
                        "en" === this.$store.getters.language
                            ? level.nameEN
                            : level.nameCN,
                    value: level.code
                });
            });
        },
        getTrainingLevelStr(val) {
            let value = "";
            this.options.trainingLevel.forEach(element => {
                if (element.value == val) {
                    value = element.label;
                }
            });
            return value;
        },
        getFacultyStr(val) {
            let value = "";
            this.options.faculty.forEach(element => {
                if (element.value == val) {
                    value = element.label;
                }
            });
            return value;
        },
        getdialogTitle(val) {
            return val
                ? this.$t("culture.profession.addProfession")
                : this.$t("culture.profession.editProfession");
        },
        editProfession(data) {
            const _this = this;
            this.isEdit = true;
            this.dialogTitle = this.getdialogTitle(this.isEdit);
            this.showDialog = true;
            let param = {};
            param.grade = data.grade;
            param.professionCode = data.professionCode;
            this.options.toDegree = this.findToDegreeListByTrainingLevelId(
                data.trainingLevel
            );
            this.model.belongBigProfession = data.belongBigProfession;
            findDirMaintenByPro(param).then(res => {
                if (res.code == 200) {
                    let dirStr = "";
                    for (let i = 0; i < res.data.length; i++) {
                        if (i == res.data.length - 1) {
                            dirStr += res.data[i].name;
                        } else {
                            dirStr += res.data[i].name + ", ";
                        }
                    }
                    this.direcModel.direction = dirStr;
                }
            });
            findCampusProById(data.id).then(res => {
                if (res.code == 200) {
                    this.isClearCateCode = false;
                    this.isClearProCode = false;
                    res.data.grade = res.data.grade + "";
                    res.data.startTime = res.data.startTime;
                    res.data.endTime = res.data.endTime;
                    res.data.categoryCode = [];
                    res.data.professionClassCode = [];
                    res.data.ministryEduCode = [];
                    this.model = res.data;
                    this.model.toDegree = res.data.toDegree.split(",");
                    let cate = [];
                    let pro = [];
                    let edu = [];
                    for (
                        let i = 0;
                        i < res.data.campusEduProRelations.length;
                        i++
                    ) {
                        if (res.data.campusEduProRelations[i].categoryCode) {
                            cate.push(
                                res.data.campusEduProRelations[i].categoryCode
                            );
                        }
                        if (
                            res.data.campusEduProRelations[i]
                                .professionClassCode
                        ) {
                            pro.push(
                                res.data.campusEduProRelations[i]
                                    .professionClassCode
                            );
                        }
                        if (res.data.campusEduProRelations[i].ministryEduCode) {
                            edu.push(
                                res.data.campusEduProRelations[i]
                                    .ministryEduCode
                            );
                        }
                    }
                    this.model.categoryCode = Array.from(new Set(cate));
                    this.model.professionClassCode = Array.from(new Set(pro));
                    this.model.ministryEduCode = Array.from(new Set(edu));
                }
            });
        },
        viewProfession(row) {
            const _this = this;
            _this.viewDialogTitle = _this.$t(
                "culture.profession.viewProfession"
            );
            _this.isView = true;
            _this.showViewDialog = true;
            let param = {};
            param.grade = row.grade;
            param.professionCode = row.professionCode;
            this.options.toDegree = this.findToDegreeListByTrainingLevelId(
                row.trainingLevel
            );
            findDirMaintenByPro(param).then(res => {
                if (res.code == 200) {
                    let dirStr = "";
                    for (let i = 0; i < res.data.length; i++) {
                        if (i == res.data.length - 1) {
                            dirStr += res.data[i].name;
                        } else {
                            dirStr += res.data[i].name + ", ";
                        }
                    }
                    _this.direcModel.direction = dirStr;
                }
            });
            findCampusProById(row.id).then(res => {
                if (res.code == 200) {
                    _this.isClearCateCode = false;
                    _this.isClearProCode = false;
                    res.data.grade = res.data.grade + "";
                    res.data.startTime = res.data.startTime;
                    res.data.endTime = res.data.endTime;
                    res.data.categoryCode = [];
                    res.data.professionClassCode = [];
                    res.data.ministryEduCode = [];
                    _this.viewModel = res.data;
                    _this.viewModel.toDegree = res.data.toDegree.split(",");
                    let cate = [];
                    let pro = [];
                    let edu = [];
                    for (
                        let i = 0;
                        i < res.data.campusEduProRelations.length;
                        i++
                    ) {
                        if (res.data.campusEduProRelations[i].categoryCode) {
                            cate.push(
                                res.data.campusEduProRelations[i].categoryCode
                            );
                        }
                        if (
                            res.data.campusEduProRelations[i]
                                .professionClassCode
                        ) {
                            pro.push(
                                res.data.campusEduProRelations[i]
                                    .professionClassCode
                            );
                        }
                        if (res.data.campusEduProRelations[i].ministryEduCode) {
                            edu.push(
                                res.data.campusEduProRelations[i]
                                    .ministryEduCode
                            );
                        }
                    }
                    _this.viewModel.categoryCode = Array.from(new Set(cate));
                    _this.viewModel.professionClassCode = Array.from(
                        new Set(pro)
                    );
                    _this.getProfessionClassList();
                    _this.getEduProCode();
                    _this.viewModel.ministryEduCode = Array.from(new Set(edu));
                }
                _this.viewModel.facultyDisplay = _this.viewModel.facultyI18n;
                _this.viewModel.trainingLevelDisplay =
                    _this.viewModel.trainingLevelI18n;
                _this.viewModel.professionCodeDisplay =
                    _this.viewModel.professionCode;
                _this.viewModel.professionNameDisplay =
                    _this.viewModel.professionName;
                _this.viewModel.professionNameEnDisplay =
                    _this.viewModel.professionNameEn;

                // 视图状态下查询专业大类
                let param = {};
                param.grade = +_this.viewModel.grade;
                param.trainingLevel = _this.viewModel.trainingLevel;
                param.faculty = _this.viewModel.faculty;
                param.category = "1";
                _this.getBelongBigPro(param);
            });
        },
        editDirection(data) {
            this.isEdit = true;
            this.addDirecTitle =
                this.$t("culture.profession.editDirection") +
                "(" +
                this.direcTitle +
                ")";
            let param = {};
            param.grade = data.grade;
            param.professionCode = data.professionCode;
            param.code = data.code;
            findDirMaintenDetail(param).then(res => {
                if (res.code == 200) {
                    res.data.startTime = res.data.startTime * 1000;
                    res.data.failureTime = res.data.failureTime * 1000;
                    this.directionModel = res.data;
                }
            });
            this.editPositinDialog = true;
        },
        addProfession() {
            this.isEdit = false;
            this.resetAdd();
            //this.model.direction="不区分";
            //this.model.trainingLevel = "1";
            this.findToDegreeListByTrainingLevelId("1");
            this.dialogTitle = this.getdialogTitle(this.isEdit);
            this.showDialog = true;
        },
        addDirection() {
            this.isEdit = false;
            this.resetDirec();
            this.addDirecTitle =
                this.$t("culture.profession.addDirection") +
                "(" +
                this.direcTitle +
                ")";
            this.editPositinDialog = true;
        },
        delCampusPro(id) {
            this.$confirm(
                this.$t("message.deleteConfirm"),
                this.$t("message.prompt"),
                {
                    confirmButtonText: this.$t("message.confirm"),
                    cancelButtonText: this.$t("message.cancel"),
                    type: "warning"
                }
            ).then(_ => {
                delCampusProById(id).then(res => {
                    if (res.code == 200) {
                        this.$message({
                            type: "success",
                            message: this.$t("message.deleteSuccess")
                        });
                        this.getCampusProfessions();
                    }
                });
            });
        },

        getdialogTitle(val) {
            return val
                ? this.$t("culture.profession.editProfession")
                : this.$t("culture.profession.addProfession");
        },
        getCampusEduProRelations() {
            // this.model.grade= +this.model.grade;
            let campusEduProRelations = {};
            for (let i = 0; i < this.model.categoryCode.length; i++) {
                for (
                    let j = 0;
                    j < this.model.professionClassCode.length;
                    j++
                ) {
                    if (
                        this.model.professionClassCode[j].substring(0, 2) ==
                        this.model.categoryCode[i]
                    ) {
                        for (
                            let k = 0;
                            k < this.model.ministryEduCode.length;
                            k++
                        ) {
                            if (
                                this.model.ministryEduCode[k].substring(0, 4) ==
                                this.model.professionClassCode[j]
                            ) {
                                campusEduProRelations.categoryCode = this.model.categoryCode[
                                    i
                                ];
                                campusEduProRelations.professionClassCode = this.model.professionClassCode[
                                    j
                                ];
                                campusEduProRelations.ministryEduCode = this.model.ministryEduCode[
                                    k
                                ];
                                const clone = _.clone(campusEduProRelations);
                                this.model.campusEduProRelations.push(clone);
                            }
                        }
                    }
                }
            }
        },
        confirm() {
            this.$refs.model.validate(valid => {
                if (!valid) {
                    return;
                }
                this.model.startTime = this.model.startTime;
                this.model.endTime = this.model.endTime;
                this.model.campusEduProRelations = [];
                this.getCampusEduProRelations();
                let modelCopy = JSON.parse(JSON.stringify(this.model));
                modelCopy.toDegree = modelCopy.toDegree.join(",");
                if (this.isEdit) {
                    updateCampusPro(modelCopy).then(res => {
                        if (res.code == 200) {
                            this.$message({
                                type: "success",
                                message: this.$t("message.editSuccess")
                            });
                            this.showDialog = false;
                            this.reset();
                        }
                    });
                } else {
                    addCampusPro(modelCopy).then(res => {
                        if (res.code == 200) {
                            this.$message({
                                type: "success",
                                message: this.$t("message.addSuccess")
                            });
                            this.showDialog = false;
                            this.reset();
                        }
                    });
                }
            });
        },
        /* 
    let postData=_.cloneDeep(this.queryForm);
        postData.grade=Number(postData.grade); */
        confirmdirection() {
            this.$refs.directionModel.validate(valid => {
                if (!valid) {
                    return;
                }

                this.directionModel.startTime =
                    this.directionModel.startTime / 1000;
                this.directionModel.failureTime =
                    this.directionModel.failureTime / 1000;
                if (this.isEdit) {
                    editDirMainten(this.directionModel).then(res => {
                        if (res.code == 200) {
                            this.$message({
                                type: "success",
                                message: this.$t("message.editSuccess")
                            });
                            this.editPositinDialog = false;
                            this.getDirMaintens();
                        }
                    });
                } else {
                    addDirMainten(this.directionModel).then(res => {
                        if (res.code == 200) {
                            this.$message({
                                type: "success",
                                message: this.$t("message.addSuccess")
                            });
                            this.editPositinDialog = false;
                            this.getDirMaintens();
                        }
                    });
                }
            });
        },
        exportCampusPro() {
            let data = Object.assign({}, this.queryForm);
            exportCampusPro(data);
        },
        exportDirrection() {
            let data = Object.assign({}, this.queryForm_d);
            exportDirMainten(data);
        },
        copy() {
            this.isCopy = true;
            if (!this.queryForm.grade) {
                this.$message({
                    type: "info",
                    message: this.$t("culture.rules.plsChooseGrade")
                });
                return;
            }
            this.copyModel.showCopyDialog = true;
            this.copyModel.copyGrade = "";
        },
        copyConfirm() {
            if (this.copyModel.copyGrade) {
                let postData = _.cloneDeep(this.queryForm);
                postData.grade = +this.queryForm.grade;
                postData.copyGrade = +this.copyModel.copyGrade;
                copyCampusPro(postData).then(res => {
                    if (res.code == 200) {
                        this.$message({
                            type: "success",
                            message:
                                this.$t("culture.profession.copySuccess") +
                                res.data +
                                this.$t("culture.profession.manyRecord")
                        });
                        this.isCopy = false;
                        this.copyModel.showCopyDialog = false;
                    }
                });
            } else {
                this.$message({
                    type: "info",
                    message: this.$t("culture.rules.plsChooseCopygrade")
                });
                return;
            }
        },
        cancel() {
            this.showDialog = false;
            // this.model.categoryCode="";
        },
        reset() {
            this.queryForm.grade = "";
            this.queryForm.trainingLevel = "";
            this.queryForm.faculty = "";
            this.queryForm.keyWord = "";
            this.queryForm.copyGrade = "";
            this.queryForm.category = "";
            this.getCampusProfessions();
        },
        resetAdd() {
            (this.model.grade = ""),
                (this.model.faculty = ""),
                (this.model.trainingLevel = ""),
                (this.model.professionCode = ""),
                (this.model.professionName = ""),
                (this.model.professionNameEn = ""),
                (this.model.category = ""),
                (this.model.categoryCode = []),
                (this.model.professionClassCode = []),
                (this.model.ministryEduCode = []),
                (this.model.campusEduProRelations = []),
                (this.model.major = ""),
                (this.model.ministryEduCode = ""),
                (this.model.lengthSchooling = ""),
                (this.model.toDegree = []),
                (this.model.belongBigProfession = ""),
                (this.model.startTime = ""),
                (this.model.endTime = ""),
                (this.model.remark = ""),
                (this.model.enrollTwice = "2"),
                (this.model.direction = "");
        },
        resetDirec() {
            this.directionModel.code = "";
            this.directionModel.name = "";
            this.directionModel.nameEn = "";
            this.directionModel.startTime = "";
            this.directionModel.failureTime = "";
            this.directionModel.remark = "";
        },
        // 清除表单校验
        resetFormValidate() {
            this.$refs.model.resetFields();
        },
        resetCopyValidate() {
            this.$refs.copyModel.resetFields();
        },
        resetFormValidate_d() {
            this.$refs.directionModel.resetFields();
        },
        findToDegreeListByTrainingLevelId(val) {
            findDegreeTypeByTrainingLevel({
                trainingLevel: "1",
                type: "G_XWDM"
            })
                .then(res => {
                    if (res.code == 200) {
                        this.options.toDegree =
                            res.data.length > 0 &&
                            res.data.map(item => ({
                                label:
                                    "en" === this.$store.getters.language
                                        ? item.nameEN
                                        : item.nameCN,
                                value: item.code
                            }));
                    }
                })
                .catch(e => {
                    console.log(e);
                });
        }
    }
};
</script>
<style lang="scss">
#schoolMajorDiv {
    .left-part-box,
    .right-part-box {
        float: left;
        margin-right: 20px;
    }
    .left-part-box {
        width: 300px;
        .el-tree {
            min-height: 600px;
        }
    }
    .right-part-box {
        width: calc(96% - 300px);
        .el-card {
            width: 100%;
            display: inline-block;
        }
    }
    #el_card1 {
        height: 100px;
    }
    #el_card2 {
        min-height: 450px;
    }
    .custom-tree-node {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 14px;
        padding-right: 4px;
        color: #3f3f3f;
    }
    .item-title {
        display: block;
        width: 100%;
        height: 32px;
    }
    .tree-title {
        margin: 0;
        line-height: 28px;
        padding-left: 8px;
        .el-button {
            float: right;
            margin-right: 4px;
        }
    }
    .el-tree {
        overflow: auto;
        width: 100%;
        display: inline-block;
        .el-tree-node.is-expanded > .el-tree-node__children {
            display: inline-block;
        }
    }
    .el-dialog__body {
        padding: 30px 20px;
        color: #606266;
        font-size: 14px;
        min-height: 330px;
    }
}
#profession-copy-dialog .el-dialog__body {
    min-height: 130px !important;
}
</style>

